<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>6.Bootstrap表单</title>

    <link rel="stylesheet" href="../css/bootstrap.css"/>

    <script src="../js/jquery-1.11.1.min.js"></script>
    <script src="../js/bootstrap.js"></script>
</head>
<body>
<!--<div class="container">
    <form class="form-horizontal" role="form">
        <div class="form-group">
            <label for="username" class="col-sm-2 control-label">用户名称</label>
            <div class="col-sm-10">
                <input type="text" id="username" class="form-control" placeholder="请输入用户名称">
            </div>
        </div>

        <div class="form-group">
            <label for="userpwd" class="col-sm-2 control-label">设置密码</label>
            <div class="col-sm-10">
                <input type="password" id="userpwd" class="form-control" placeholder="请输入密码">
            </div>
        </div>

        <div class="form-group">
            <div class="col-sm-10 col-sm-offset-2">
                <div class="checkbox">
                    <label>
                        <input type="checkbox">记住我
                    </label>
                </div>
            </div>
        </div>

        <div class="form-group">
            <div class="col-sm-10 col-sm-offset-2">
                <button type="button" class="btn">提交表单</button>
            </div>
        </div>
    </form>
</div>-->

<!--<div class="container">
    <form role="form">
        <div class="checkbox">
            <label for="checkbox1">
                <input type="checkbox" id="checkbox1">这是一个复选按钮1
            </label>
        </div>

        <div class="checkbox disabled">
            <label for="checkbox2">
                <input type="checkbox" id="checkbox2" disabled="disabled">这是一个复选按钮2
            </label>
        </div>

        <div class="radio">
            <label for="radio1">
                <input type="radio" id="radio1" name="myradio">
                单选按钮1
            </label>
        </div>

        <div class="radio">
            <label for="radio2">
                <input type="radio" id="radio2" name="myradio" checked="checked">
                单选按钮2
            </label>
        </div>

        <div class="radio disabled">
            <label for="radio3">
                <input type="radio" id="radio3" name="myradio" disabled="disabled">
                单选按钮3
            </label>
        </div>

        <div>
            <select class="form-control">
                <option>上海</option>
                <option>苏州</option>
                <option>南京</option>
            </select>

            <select class="form-control" multiple>
                <option>上海</option>
                <option>苏州</option>
                <option>南京</option>
            </select>
        </div>
    </form>
</div>-->

<div class="container">
    <form role="form">
        <div class="form-group has-success">
            <label for="success" class="control-label">success</label>
            <input type="text" id="success" class="form-control" placeholder="请输入">
        </div>

        <div class="form-group has-warning">
            <label for="warning" class="control-label">warning</label>
            <input type="text" id="warning" class="form-control" placeholder="请输入">
        </div>

        <div class="form-group has-error">
            <label for="error" class="control-label">error</label>
            <input type="text" id="error" class="form-control" placeholder="请输入">
        </div>

        <div class="has-success">
            <div class="checkbox">
                <label>
                    <input type="checkbox">选项1
                </label>
            </div>
        </div>

        <div class="has-warning">
            <div class="checkbox">
                <label>
                    <input type="checkbox">选项1
                </label>
            </div>
        </div>

        <div class="has-error">
            <div class="checkbox">
                <label>
                    <input type="checkbox">选项1
                </label>
            </div>
        </div>

        <div class="form-group has-success has-feedback">
            <label for="success1" class="control-label">success</label>
            <input type="text" id="success1" class="form-control" placeholder="请输入"/>
            <span class="glyphicon glyphicon-ok form-control-feedback"></span>
        </div>

        <div class="form-group has-warning has-feedback">
            <label for="warning1" class="control-label">warning</label>
            <input type="text" id="warning1" class="form-control" placeholder="请输入"/>
            <span class="glyphicon glyphicon-warning-sign form-control-feedback"></span>
        </div>

        <div class="form-group has-error has-feedback">
            <label for="error1" class="control-label">error</label>
            <input type="text" id="error1" class="form-control" placeholder="请输入"/>
            <span class="glyphicon glyphicon-remove form-control-feedback"></span>
        </div>
    </form>
</div>


</body>
</html>